<!-- 新建实物奖品 -->
<template>
  <a-drawer v-model:visible="vdata.visible" :maskClosable="false" :title="vdata.isAdd ? '新增活动类型' : '修改活动类型'" width="40%">
    <a-form
      ref="formRef"
      :model="vdata.saveObject"
      layout="vertical"
      labelAlign="left"
      :rules="vdata.rules"
      :colon="false"
      :wrapper-col="{ span: 24 }"
      style="margin-top: 30px; margin-left: 20px"
    >
      <a-row>
        <a-col :span="11">
          <a-form-item label="活动类型名称" name="activityTypeName">
            <a-input v-model:value="vdata.saveObject['activityTypeName']" placeholder="活动类型名称" />
          </a-form-item>
        </a-col>
        <a-col :push="1" :span="11">
          <a-form-item label="活动类型编号" name="activityTypeNo">
            <a-input v-model:value="vdata.saveObject['activityTypeNo']" :disabled="!vdata.isAdd" placeholder="类型code,一旦新建不允许修改" />
          </a-form-item>
        </a-col>
        <a-col :span="24">
          <a-form-item label="活动类型描述" name="remark" :wrapper-col="{ span: 23 }">
            <a-textarea v-model:value="vdata.saveObject['remark']" placeholder="活动类型描述" :rows="4" />
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
    <div class="drawer-btn-center">
      <a-button :style="{ marginRight: '8px' }" style="margin-right: 8px" @click="onClose">
        <close-outlined />
        取消
      </a-button>
      <a-button type="primary" :loading="vdata.btnLoading" @click="handleOkFunc">
        <check-outlined />
        保存
      </a-button>
    </div>
  </a-drawer>
</template>

<script setup lang="ts">
// import { req, API_URL_ACTIVITY_TYPE } from '@/api/manage'
import {$activityTypeAdd,$activityTypeEdit} from '@/api/activityManage/activityType/index'
import { reactive, ref, defineExpose, getCurrentInstance } from 'vue'
const { $infoBox, $access } = getCurrentInstance()!.appContext.config.globalProperties
const formRef = ref()

const props = defineProps(['callBackFunc'])

const vdata:any = reactive({
  isAdd: false, // 新增OR修改
  visible: false,
  btnLoading: true,
  saveObject: {},
  rules: {
    activityTypeName: [{ required: true, message: '活动类型名称不能为空', trigger: 'blur' },],
    activityTypeNo: [{ required: true, message: '活动类型code不能为空', trigger: 'blur' },],
    remark: [{ required: true, message: '活动类型描述不能为空', trigger: 'blur' },],
  },
})

function handleOkFunc() {
  formRef.value.validate().then(() => {
    vdata.btnLoading = true
    if(vdata.isAdd){  // 新增
      $activityTypeAdd(vdata.saveObject).then(res=>{
        $infoBox.message.success('新增成功！')
        props.callBackFunc()
        onClose()
      }).finally(()=>{
        vdata.btnLoading = false
      })
    }else{  // 修改
      $activityTypeEdit({ ...vdata.saveObject }).then(res=>{
        $infoBox.message.success('修改成功！')
        props.callBackFunc()
        onClose()
      }).finally(()=>{
        vdata.btnLoading = false
      })
    }
  }).catch(() => {})
}

function onClose() {
  vdata.visible = false
}

function show(record) {
  vdata.isAdd = !record
  vdata.btnLoading = false
  vdata.saveObject = {}
  if (formRef.value !== undefined) {
    formRef.value.resetFields()
  }
  if(!vdata.isAdd){ // 修改
    vdata.saveObject = { ...record }
  }
  vdata.visible = true
}

defineExpose({
  show,
})
</script>